﻿<%@ Page Language="C#" AutoEventWireup="true" CodeFile="History.aspx.cs" Inherits="UI_Mail_History" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title></title>
    <link href="../../js/jquery.easyui/themes/default/easyui.css" rel="stylesheet" type="text/css" />
    <link href="../../js/jquery.easyui/themes/icon.css" rel="stylesheet" type="text/css" />
    <script src="../../js/jquery.easyui/jquery.min.js" type="text/javascript"></script>
    <script src="../../js/jquery.easyui/jquery.easyui.min.js" type="text/javascript"></script>
    <script type="text/javascript">
     $(document).ready(function(){
       $('#history').datagrid({
         columns:[[
           { field: 'OrderId', title: '订单号', hidden: true },
           { field: 'Paidon', title: '付款状态', hidden: true },
           { field: 'Status', title: '订单状态', hidden: true },
           { field: 'Resend', title: '是否重发', hidden: true },
           { field: 'OrderDetails', title: '订单详细', hidden: true }
         ]],
         data: [
           { OrderId: '12345', Paidon: '已付款', Status: '已审核', Resend: '是', OrderDetails: '[{ "Title": "iPhone 5s case", "Code": "CA+A+IPH5", "ItemID": "190956311758" }]' }
         ]
       });

       var cardview = $.extend({}, $.fn.datagrid.defaults.view, {
         renderRow: function(target, fields, frozen, rowIndex, rowData) {
           var cc = [];
           cc.push('<td colspan=' + fields.length + ' style="padding:10px 5px;border:0;">');
           if (!frozen){
             cc.push('<div style="float:left;margin-left:20px;">');
             cc.push('<p><span>订单号:' + rowData['OrderId'] + '</span></p>');
             cc.push('<hr />');
             cc.push('<p>');
             cc.push('<span style="margin-left:20px">付款状态: ' + rowData['Paidon'] + '</span>');
             cc.push('<span style="margin-left:20px">订单状态: ' + rowData['Status'] + '</span>');
             cc.push('<span style="margin-left:20px">是否重发: ' + rowData['Resend'] + '</span>');
             cc.push('<span style="margin-left:20px">是否退款: ' + rowData['Refund'] + '</span>');
             cc.push('<span style="margin-left:20px">销售日期: ' + rowData['SaleDate'] + '</span>');
             cc.push('<span style="margin-left:20px">付款日期: ' + rowData['PaidonDate'] + '</span>');
             cc.push('<span style="margin-left:20px">发货日期: ' + rowData['ShippingDate'] + '</span>');
             cc.push('</p>');
             var details = $.parseJSON(rowData['OrderDetails']);
             for(var i = 0; i < details.length; i++) {
               cc.push('<div style="width:100%;margin-left:20px;">');
               cc.push('<div style="float:left;text-overflow:ellipsis;width:50%;white-space:nowrap;overflow:hidden;"><a href="http://www.ebay.co.uk/itm/' + details[i].ItemID + '" target="_blank" >' + details[i].Title + '</a></div>');
               cc.push('<div style="float:left;width:20%;">X ' + details[i].Quantity + '</div>');
               cc.push('<div style="float:left;width:20%;"> ' + details[i].Price + '</div>');
               cc.push('<br />');
               cc.push('<div>产品代码: ' + details[i].ProdCode + '</div>');
               cc.push('<div>Item ID: ' + details[i].ItemID + '</div>');
               cc.push('<hr />');
               cc.push('<table style="border:0;width:100%;">');
               cc.push('<tr><td>客户选择发货方式: ' + details[i].ShipmentType + '</td><td>邮费: ' + details[i].Postage + '</td></tr>');
               cc.push('<tr><td rowspan=2>付款方式: ' + details[i].PaymentType + '</td><td>总价: ' + details[i].TotalPrice + '</td></tr>');
               cc.push('<tr><td>交易费: ' + details[i].TradingFee + '</td></tr>');
               cc.push('</table>');
               cc.push('</div>');
             }
             cc.push('</div>');
           }
           cc.push('</td>');
           return cc.join('');
         }
       });
       
       $('#history').datagrid({
         view: cardview
       });
     });
    </script>
  </head>
  <body>
    <div>
      <table id="history" />
    </div>
  </body>
</html>
